<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>我的应用 - <?= $systemConfig['system_name'] ?? '' ?></title>
<link rel="stylesheet" href="/layui/css/layui.css">
<script src="/static/js/jquery.min.js"></script>
<script src="/layui/layui.js"></script>
<style>*{margin:0;padding:0;box-sizing:border-box;}body{background:#f5f7fa;font-family:"Microsoft YaHei","PingFang SC",sans-serif;}
.header{background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.08);}.header .inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 20px;height:60px;}
.header .logo{font-size:20px;font-weight:700;color:#1e3c72;text-decoration:none;}.header .nav{display:flex;gap:16px;}
.header .nav a{color:#555;text-decoration:none;font-size:14px;padding:8px 12px;border-radius:4px;}.header .nav a:hover,.header .nav a.active{color:#1e9fff;background:#f0f7ff;}
.container{max-width:1000px;margin:0 auto;padding:20px;}.app-row{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:20px;}
.app-card{flex:1;min-width:300px;background:#fff;border-radius:10px;padding:20px;box-shadow:0 2px 8px rgba(0,0,0,.05);}
.app-card h4{font-size:17px;margin-bottom:10px;color:#333;}.app-card .field{margin-bottom:6px;font-size:13px;color:#666;}
.app-card .field b{color:#333;}.app-card .btns{margin-top:12px;display:flex;gap:8px;flex-wrap:wrap;}.copy-btn{cursor:pointer;margin-left:6px;color:#1e9fff;font-size:12px;}</style>
</head>
<body>
<div class="header"><div class="inner">
    <a href="/" class="logo"><?= $systemConfig['system_name'] ?? '' ?></a>
    <div class="nav"><a href="/user/index/dashboard">控制台</a><a href="/user/index/packages">套餐市场</a><a href="/user/index/myApps" class="active">我的应用</a><a href="/user/index/callStats">调用统计</a><a href="/user/index/myOrders">我的订单</a><a href="/user/index/myPackages">已购套餐</a><a href="/user/index/recharge">余额充值</a><a href="/user/index/apiDoc">接入文档</a><a href="/user/index/profile"><?= $userInfo['nickname'] ?? $userInfo['username'] ?></a><a href="/user/index/logout">退出</a></div>
</div></div>
<div class="container">
    <div style="margin-bottom:20px;"><button class="layui-btn layui-btn-normal" onclick="showCreateApp()"><i class="layui-icon layui-icon-add-1"></i> 创建应用</button></div>
    <div class="app-row">
        <?php foreach($apps as $app): ?>
        <div class="app-card">
            <h4><?= $app['name'] ?></h4>
            <div class="field">AppID: <b><?= $app['app_id'] ?></b> <span class="copy-btn" onclick="copyText('<?= $app['app_id'] ?>')"><i class="layui-icon layui-icon-template-1"></i> 复制</span></div>
            <div class="field">AppKey: <b id="key_<?= $app['id'] ?>"><?= maskString($app['app_key'], 0, 24) ?></b> <span class="copy-btn" onclick="copyText('<?= $app['app_key'] ?>')"><i class="layui-icon layui-icon-template-1"></i> 复制</span></div>
            <div class="field">剩余次数: <b><?= $app['remain_calls'] ?></b> | 到期: <b><?= $app['expire_time'] ?: '未购买套餐' ?></b></div>
            <div class="field">状态: <?= $app['status']?'<span style="color:green">正常</span>':'<span style="color:red">禁用</span>' ?> | 套餐: <?= $app['package_name'] ?></div>
            <div class="btns">
                <button class="layui-btn layui-btn-xs layui-btn-warm" onclick="resetKey(<?= $app['id'] ?>)">重置AppKey</button>
                <a href="/user/index/packages" class="layui-btn layui-btn-xs layui-btn-normal">购买套餐</a>
                <button class="layui-btn layui-btn-xs layui-btn-danger" onclick="deleteApp(<?= $app['id'] ?>)">删除</button>
            </div>
        </div>
        <?php endforeach; ?>
        <?php if(empty($apps)): ?><div style="text-align:center;padding:60px;color:#999;width:100%;">还没有创建应用，点击上方按钮创建</div><?php endif; ?>
    </div>
</div>
<div id="createAppModal" style="display:none;padding:20px;">
    <form class="layui-form"><div class="layui-form-item"><label class="layui-form-label">应用名称</label><div class="layui-input-block"><input type="text" id="appName" class="layui-input" placeholder="例如：我的网站"></div></div>
    <div class="layui-form-item"><label class="layui-form-label">选择套餐</label><div class="layui-input-block"><select id="appPackage"><option value="">请选择套餐</option>
    <?php foreach($purchasedPackages as $pp): ?><option value="<?= $pp['id'] ?>"><?= htmlspecialchars($pp['name']) ?></option><?php endforeach; ?>
    </select></div></div></form>
    <?php if(empty($purchasedPackages)): ?><div style="color:#ff5722;margin-bottom:10px;font-size:13px;">您还没有已购买的套餐，请先去<a href="/user/index/packages" style="color:#1e9fff;">套餐市场</a>购买</div><?php endif; ?>
</div>
<script>
var apps = <?= json_encode($apps, JSON_UNESCAPED_UNICODE) ?>;
function showCreateApp(){layer.open({type:1,title:'创建应用',area:['450px','300px'],content:$('#createAppModal'),btn:['确定','取消'],yes:function(index){var name=$('#appName').val(),pkg=$('#appPackage').val();if(!name){layer.msg('请输入应用名称');return;}if(!pkg){layer.msg('请选择套餐');return;}$.post('/user/index/createApp',{name:name,package_id:pkg},function(res){layer.msg(res.msg,{icon:res.code===0?1:2});if(res.code===0) setTimeout(function(){location.reload();},1000);});}});}
function copyText(text){var input=document.createElement('textarea');input.value=text;document.body.appendChild(input);input.select();document.execCommand('copy');document.body.removeChild(input);layer.msg('已复制到剪贴板');}
function resetKey(id){layer.confirm('重置AppKey后旧Key将立即失效！',function(){$.post('/user/index/resetAppKey',{id:id},function(res){layer.msg(res.msg,{icon:res.code===0?1:2});if(res.code===0) setTimeout(function(){location.reload();},1000);});});}
function deleteApp(id){layer.confirm('确认删除该应用？',function(){$.post('/user/index/deleteApp',{id:id},function(res){layer.msg(res.msg,{icon:res.code===0?1:2});if(res.code===0) setTimeout(function(){location.reload();},1000);});});}
</script>
</body>
</html>